<!--
 * @Author: WuFeng <763467339@qq.com>
 * @Date: 2022-04-13 10:13:11
 * @LastEditTime: 2022-07-09 14:48:28
 * @LastEditors: WuFeng <763467339@qq.com>
 * @Description: 公共底部按钮区
 * @FilePath: \vue3-element-plus-web\src\views\DrawerDemo\components\Drawer\footer.vue
 * Copyright 版权声明
-->
<template>
  <div style="flex: auto">
    <!-- 共用按钮 -->
    <el-button @click="handleCancel">取消</el-button>
    <!-- 新建 -->
    <template v-if="drawerCurrent.drawerType === 'CREATE'">
      <el-button type="primary" @click="createData">保存</el-button>
    </template>
    <!-- 编辑 -->
    <template v-if="drawerCurrent.drawerType === 'UPDATE'">
      <el-button type="primary" @click="updateData">保存</el-button>
    </template>
    <!-- 查看 -->
    <template v-if="drawerCurrent.drawerType === 'DETAIL'">
      <el-button type="primary" @click="handleUpdate">编辑</el-button>
      <el-popconfirm
        title="确定要删除吗？"
        @confirm="handleDelete"
      >
        <template #reference>
          <el-button type="danger">删除</el-button>
        </template>
      </el-popconfirm>
    </template>
    <!-- <el-button @click="handleCloseDrower">关闭</el-button> -->
  </div>
</template>

<script>
import { mapGetters } from 'vuex'

export default {
  name: 'Footer',
  computed: {
    ...mapGetters([
      'drawerCurrent'
    ])
  },
  components: {
  },
  data() {
    return {
    }
  },
  watch: {
  },
  created() {
  },
  activated() {
  },
  deactivated() {
  },
  methods: {
    // 取消
    handleCancel() {
      this.$store.dispatch('CloseDrawer', { direct: false })
    },
    // 编辑
    handleUpdate() {
      this.$store.dispatch('ShowDrawer', {
        module: 'DRAWER_DEMO',
        type: 'UPDATE',
        params: this.drawerCurrent.params
      }).then(res => {

      })
    },
    // 添加 - 保存
    createData() {
      this.$emit('handleCallback', {
        handle: 'createData',
        params: {
        }
      })
    },
    // 编辑 - 保存
    updateData() {
      this.$emit('handleCallback', {
        handle: 'updateData',
        params: {
        }
      })
    },
    // 删除 - 保存
    handleDelete() {
      this.$emit('handleCallback', {
        handle: 'deleteData',
        params: {
        }
      })
    },
    // 取消关闭抽屉
    handleCloseDrower() {
      this.$store.dispatch('CloseDrawer')
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
</style>
